<template>
  <div>
    <h1>首页</h1>
    <h1>来自store的问候：{{$store.state.name}}</h1>
    <h1>来自store的问候：{{$store.name}}</h1>
    <button @click="add">number 的值是：{{ number }}</button>
    <h3>count 的值是：{{$store.state.count}}</h3>
  </div>
</template>
<script>
  import { ref,onMounted } from "vue";
  import { useStore } from "vuex";
  export default {
    setup() {
      const store = useStore();
      const state = ref(store.state);
      const number = ref(0);
      const add = () => {
        number.value = number.value+1;
        store.commit('increment')
      };
      onMounted(()=> {
        console.log("number 的值是："+ number.value);
        console.log("state 的值是："+state.name);
      });
      return{
        number,
        add,
        state
      };
    }
  };
</script>